<!-- 活动类型管理 -->
<template>
  <page-header-wrapper>
    <a-card class="table-card">
      <GzSearchForm :searchFunc="searchFunc" :resetFunc="()=>{ searchData = {} }">
        <!-- <GzTextUp placeholder="活动类型ID" v-model:value="searchData['activityTypeId']"/> -->
        <GzTextUp v-model:value="searchData['supplierName']" placeholder="供应商名称" />
        <GzTextUp v-model:value="searchData['username']" placeholder="用户名" />
        <a-form-item class="table-search-item">
          <a-select v-model:value="searchData['state']" :placeholder="'状态'">
            <a-select-option value="">全部</a-select-option>
            <a-select-option :value="0">取消合作</a-select-option>
            <a-select-option :value="1">正常合作</a-select-option>
          </a-select>
        </a-form-item>
      </GzSearchForm>
  
      <!-- 列表渲染 -->
      <GzTable
        ref="infoTableRef"
        :init-data="true"
        :req-table-data-func="reqTableDataFunc"
        :table-columns="tableColumns"
        :search-data="searchData"
        row-key="activityTypeId"
        :scrollX="0"
      >
        <template #topBtnSlot>
          <a-button v-if="$access('ENT_VIRTUAL_SUPPLIER_ADD')" type="primary" @click="addOrEditFunc(false)">
            <plus-outlined />新建
          </a-button>
        </template>
  
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'checked'">
            <GzTableColState :state="record.state" :show-switch-type="$access('ENT_VIRTUAL_SUPPLIER_EDIT')" :on-change="(state) => { return updateState(record.virtualSupplierId, state)}" />
          </template>
          <template v-if="column.key == 'operation'">
            <a-button v-if="$access('ENT_VIRTUAL_SUPPLIER_EDIT')" type="link" @click="addOrEditFunc(record)">修改</a-button>
            <a-button v-if="$access('ENT_VIRTUAL_SUPPLIER_SYNC')" type="link" @click="synchronizePproducts(record)">同步商品</a-button>
            <a-button v-if="$access('ENT_VIRTUAL_SUPPLIER_CALLBACK')" type="link" @click="setCallback(record)">设置回调</a-button>
          </template>
        </template>
      </GzTable>
    </a-card>
    <!-- 新增OR修改 -->
    <AddOrEdit ref="addOrEditRef" :callBackFunc="searchFunc" />
  </page-header-wrapper>
  <a-modal v-model:visible="visible" title="设置回到地址" @ok="handleOk">
    <a-input v-model:value="calbackUrl" placeholder="请输入回调地址" />
  </a-modal>
</template>
  
  <script lang="ts" setup>
  import AddOrEdit from './AddOrEdit.vue'
  // import { req, API_URL_VIRTUAGOODS_SUPPLIER, $activityTypeDelete,$syncGoods,API_URL_VIRTUALGOODS_SUPPLIER_UPDATESTATE } from '@/api/manage'
  import { ref, reactive, getCurrentInstance,} from 'vue'
  import {$apiAwardVirtualSupplier,$apiAwardVirtualSupplierUpdateState,$syncGoods,$apiAwardVirtualSupplierSetGoodsNotifyUrl} from '@/api/externalGoods/supplier/index'
  
  const { $infoBox, $access } = getCurrentInstance()!.appContext.config.globalProperties
  
  const visible = ref(false)
  const infoTableRef = ref()
  const addOrEditRef = ref()
  const calbackUrl = ref()
  const virtualSupplierId = ref('')
  const tableColumns = reactive([
    { key: 'supplierName', title: '供应商名称',dataIndex: 'supplierName', },
    { key: 'websiteUrl', title: '供应商网址',dataIndex: 'websiteUrl' },
    { key: 'username', title: '网址登录用户名', dataIndex:'username' },
    { key: 'checked', title: '状态', dataIndex:'checked',ellipsis:true,width: 90, },
    { key: 'operation', title: '操作', dataIndex: 'operation', align: 'center',width: 300, }
  ])
  const searchData:any = ref({})
  // 请求table接口数据
  function reqTableDataFunc(params: any) { 
    return $apiAwardVirtualSupplier(params)
  }
  
  function searchFunc() {
    infoTableRef.value.refTable(true)
  }
  // 修改状态
  function updateState (virtualSupplierId, state) { // 【更新状态】
    const title = state === 1 ? '确认[启用]该供应商？' : '确认[停用]该供应商？'
    const content = state === 1 ? '启用后，该供应商将会上线。' : '停用后，该供应商将会下线。'

    return new Promise<void>((resolve, reject) => {
      $infoBox.confirmDanger(title, content, () => {
        return $apiAwardVirtualSupplierUpdateState({ virtualSupplierId, state: state }).then(res => {
          searchFunc()
          resolve()
        }).catch(err => reject(err))
      },
        () => {
        reject(new Error())
      })
    })
  }
  // 新增OR修改
  function addOrEditFunc(record){
    addOrEditRef.value.show(record)
  }
  // // 删除卡券
  // function activityTypeDelete(activityTypeId){
  //   $infoBox.confirmDanger('确认删除？', '请确认是否删除当前奖品？', () => {
  //     $activityTypeDelete(activityTypeId).then(res => {
  //       $infoBox.message.success('删除成功！')
  //       infoTableRef.value.refTable(true)
  //     })
  //   })
  // }
// 同步商品
function synchronizePproducts(record){
  $infoBox.confirmDanger('确认同步？', '请确认是否同步当前供应商的商品？', () => {
    $syncGoods({virtualSupplierId:record.virtualSupplierId}).then(res => {
      // $infoBox.message.success('同步成功！')
      // infoTableRef.value.refTable(true)
    })
    // $infoBox.message.success('正在同步请等候！')
  })
}
function setCallback (record){
  virtualSupplierId.value = record.virtualSupplierId
  calbackUrl.value = ''
 visible.value = true
}
function handleOk () {
  $apiAwardVirtualSupplierSetGoodsNotifyUrl({notifyUrl:calbackUrl.value,virtualSupplierId:virtualSupplierId.value}).then(res=>{
    console.log(res)
    
  }).finally(()=>{
    visible.value = false
  })
  
  }
  
  </script>
  